<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
%>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="copyright" content="Tencent"/>
    <meta name="keywords" content=""/>
    <meta name="description" content=""/>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="format-detection" content="telephone=no">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <title>我的优惠券</title>
    <link rel="stylesheet" type="text/css" href="<%=path%>/css/marketing/mobile_coupon_public.css" />
    <link rel="stylesheet" type="text/css" href="<%=path%>/css/marketing/mobile_coupon_style.css" />
    <style>
  
    </style>
</head>
<body style="background:#f0f2f5;">
    <div class="content_tab">
        <ul class="nav">
            <li class="on">未使用</li>
            <li>使用记录</li>
            <li>已过期</li>
        </ul>
        <div class="container">
            <ul class="surrent" id="valid">
                <div style="clear:both;"></div>
            </ul>
            <ul  id="used">
            </ul>
            <ul  id="unValid">
            </ul>
        </div>
    </div>

 
	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
	<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
	<script src="<%=path%>/js/marketing/public.js"></script>
	<script src="<%=path%>/js/dateUtils.js"></script>
	<script src="http://pv.sohu.com/cityjson?ie=utf-8"></script>
	<script src="<%=path%>/js/system/province-city-area-data.js"></script>
    <script type="text/javascript">
	    $('.nav li').click(function(){
	        $(this).addClass('on').siblings().removeClass();
	        var index = $(this).index();
	        $('.container ul').removeClass('surrent').eq(index).addClass('surrent');
	    });
    </script>
    
    <script type="text/javascript">
        var cid="";
        var customer_id="";
        var ip="";
        var province="";
    	var city="";
    	var district="";
    	var couponBatchId="0";
    	var cityId="";
        $(function(){
        	init();
        })
        
        function init(){
        	cid=getQueryString("cid");
        	customer_id=getQueryString("customerId");
        	couponBatchId=getQueryString("couponBatch");
        	ip=returnCitySN["cip"];
        	
			city = returnCitySN["cname"];
			cityId=getCityCodeByName(city);
			getValidCouponListByCustomerId();
			getUnValidCouponListByCustomerId();
			getUsedCouponListByCustomerId();
        }
        
        function getValidCouponListByCustomerId(){
        	var url="<%=path%>/coupon/ajaxCouponPageList";
        	var paramObj=new Object();
	      	paramObj.start=0;
	      	paramObj.length=30;
	      	paramObj.customerId=customer_id;
	      	paramObj.cid=cid;
	      	paramObj.isNeedCouponModel=true;
	      	paramObj.isExpired=false;
	      	paramObj.isUsed=0;
			
			var param=new Object();
			param.extra_search=paramObj;
			param.setart=0;
			param.length=30;
			param.order=[];
			var paramJson=JSON.stringify(param);
			$.ajax({  
	            type : "POST",  
	            url : url,  
	            data : paramJson,  
	            contentType : "application/json",  
	            dataType : "json",  
	            success:function(data) {  
					setValidHtml(data.data);
	            }  
	        }); 
        }
        
        function getUnValidCouponListByCustomerId(){
        	var url="<%=path%>/coupon/ajaxCouponPageList";
        	var paramObj=new Object();
	      	paramObj.start=0;
	      	paramObj.length=30;
	      	paramObj.customerId=customer_id;
	      	paramObj.cid=cid;
	      	paramObj.isNeedCouponModel=true;
	      	paramObj.isExpired=true;
	      	paramObj.isUsed=0;
			
			var param=new Object();
			param.extra_search=paramObj;
			param.setart=0;
			param.length=30;
			param.order=[];
			var paramJson=JSON.stringify(param);
			$.ajax({  
	            type : "POST",  
	            url : url,  
	            data : paramJson,  
	            contentType : "application/json",  
	            dataType : "json",  
	            success:function(data) {  
	            	setUnValidHtml(data.data);
	            }  
	        }); 
        }
        
        function getUsedCouponListByCustomerId(){
        	var url="<%=path%>/coupon/ajaxCouponPageList";
			var paramObj=new Object();
	      	paramObj.start=0;
	      	paramObj.length=30;
	      	paramObj.customerId=customer_id;
	      	paramObj.cid=cid;
	      	paramObj.isNeedCouponModel=true;
	      	paramObj.isUsed=1;
			
			var param=new Object();
			param.extra_search=paramObj;
			param.setart=0;
			param.length=30;
			param.order=[];
			var paramJson=JSON.stringify(param);
			$.ajax({  
	            type : "POST",  
	            url : url,  
	            data : paramJson,  
	            contentType : "application/json",  
	            dataType : "json",  
	            success:function(data) {  
	            	setUsedHtml(data.data);
	            }  
	        }); 
        }
        
        function setValidHtml(data){
        	var html="";
        	for(var i in data){
        		if(data[i].couponModelType==1){
        			html+='<a  href="<%=path%>/view/ui/mobileCouponDetail?cid='+cid+'&code='+data[i].couponCode+'">';
        			html+='<li class="third_yellow_Bg">';
        			html+='<div class="left"></div>';
        			html+='<div class="right">';
        			html+='<p class="k_title" style="color:##666"><span>优惠券</span>'+data[i].couponName+'</p>';
        			html+='<h3 style="margin-top:15px;color:#a5a5a5">券码:'+data[i].couponCode+'</h3>';
        			html+='<p></p></li></a>';
        		}else{
        			html+='<a  href="<%=path%>/view/ui/mobileCouponDetail?cid='+cid+'&code='+data[i].couponCode+'">';
                    html+='<li class="blue_Bg">';
               		html+='<div class="left">';
               		if(data[i].type==1){
               			html+='<img src="<%=path%>/images/marketing/img.png" />';
               		}else{
               			html+='<b>￥</b><span>'+data[i].faceValue/100+'</span>';
               		}
          			html+='<p>满'+data[i].limitPrice/100+'元可用</p></div>';
          			html+='<div class="right">';
          			if(data[i].type==1){
          				html+='<p class="k_title"><span>物品券</span>'+data[i].couponName+'</p>';
          			}else{
          				html+='<p class="k_title"><span>优惠券</span>'+data[i].couponName+'</p>';
          			}
          			if(data[i].couponUserDefinedTemplate.validityPeriodType==0){
        				if(StringEmpty(data[i].couponUserDefinedTemplate.startTime)){
        					html+='<p class="k_time">'+formatDateTimeYMD(data[i].couponUserDefinedTemplate.startTime)+'—'+formatDateTimeYMD(data[i].expiryDate)+'</p>';
        				}else{
        					html+='<p class="k_time">'+formatDateTimeYMD(data[i].expiryDate)+'</p>';
        				}
        			}else{
        				if(StringEmpty(data[i].createTime)){
        					html+='<p class="k_time">'+formatDateTimeYMD(data[i].createTime)+'—'+formatDateTimeYMD(data[i].expiryDate)+'</p>';
        				}else{
        					html+='<p class="k_time">'+formatDateTimeYMD(data[i].expiryDate)+'</p>';
        				}
        				
        			}

          			html+='<p>点击优惠券查看详细信息</p></div></li></a>';
        		}
        	}
        	$('#valid').html(html);
        }
        
        function setUnValidHtml(data){
        	var html="";
        	for(var i in data){
        		html+='<a  href="<%=path%>/view/ui/mobileCouponDetail?cid='+cid+'&code='+data[i].couponCode+'">';
                html+='<li class="gray_Bg">';
           		html+='<div class="left">';
           		if(data[i].type==1){
           			html+='<img src="<%=path%>/images/marketing/img.png" />';
           		}else{
           			html+='<b>￥</b><span>'+data[i].faceValue/100+'</span>';
           		}
      			html+='<p>满'+data[i].limitPrice/100+'元可用</p></div>';
      			html+='<div class="right">';
      			if(data[i].type==1){
      				html+='<p class="k_title"><span>物品券</span>'+data[i].couponName+'</p>';
      			}else{
      				html+='<p class="k_title"><span>优惠券</span>'+data[i].couponName+'</p>';
      			}
      			if(data[i].couponUserDefinedTemplate.validityPeriodType==0){
    				if(StringEmpty(data[i].couponUserDefinedTemplate.startTime)){
    					html+='<p class="k_time">'+formatDateTimeYMD(data[i].couponUserDefinedTemplate.startTime)+'—'+formatDateTimeYMD(data[i].expiryDate)+'</p>';
    				}else{
    					html+='<p class="k_time">'+formatDateTimeYMD(data[i].expiryDate)+'</p>';
    				}
    			}else{
    				if(StringEmpty(data[i].createTime)){
    					html+='<p class="k_time">'+formatDateTimeYMD(data[i].createTime)+'—'+formatDateTimeYMD(data[i].expiryDate)+'</p>';
    				}else{
    					html+='<p class="k_time">'+formatDateTimeYMD(data[i].expiryDate)+'</p>';
    				}
    				
    			}


      			html+='<p>点击优惠券查看详细信息</p></div></li></a>';
        	}
        	$('#unValid').html(html);
        }
        
        function setUsedHtml(data){
        	var html="";
        	for(var i in data){
        		html+='<a  href="<%=path%>/view/ui/mobileCouponDetail?cid='+cid+'&code='+data[i].couponCode+'">';
                html+='<li class="gray_Bg">';
           		html+='<div class="left">';
           		if(data[i].type==1){
           			html+='<img src="<%=path%>/images/marketing/img.png" />';
           		}else{
           			html+='<b>￥</b><span>'+data[i].faceValue/100+'</span>';
           		}
      			html+='<p>满'+data[i].limitPrice/100+'元可用</p></div>';
      			html+='<div class="right">';
      			if(data[i].type==1){
      				html+='<p class="k_title"><span>物品券</span>'+data[i].couponName+'</p>';
      			}else{
      				html+='<p class="k_title"><span>优惠券</span>'+data[i].couponName+'</p>';
      			}
      			if(data[i].couponUserDefinedTemplate.validityPeriodType==0){
    				if(StringEmpty(data[i].couponUserDefinedTemplate.startTime)){
    					html+='<p class="k_time">'+formatDateTimeYMD(data[i].couponUserDefinedTemplate.startTime)+'—'+formatDateTimeYMD(data[i].expiryDate)+'</p>';
    				}else{
    					html+='<p class="k_time">'+formatDateTimeYMD(data[i].expiryDate)+'</p>';
    				}
    			}else{
    				if(StringEmpty(data[i].createTime)){
    					html+='<p class="k_time">'+formatDateTimeYMD(data[i].createTime)+'—'+formatDateTimeYMD(data[i].expiryDate)+'</p>';
    				}else{
    					html+='<p class="k_time">'+formatDateTimeYMD(data[i].expiryDate)+'</p>';
    				}
    				
    			}
      			html+='<p>点击优惠券查看详细信息</p></div>';
      			html+='<img src="<%=path%>/images/marketing/past_img.png" /></li></a>';
        	}
        	$('#used').html(html);
        }
        
        
        $(window).load(function() { 
			 createBrowse();
		});
        function createBrowse(){
        	var url="<%=path%>/socialCouponBatch/ajaxCreateCouponBrowse";
			$.post(url, {
				"cid" : cid,
				"customerId" : customer_id,
				"province":province,
				"city":city,
				"district":district,
				"ip":ip,
				"couponBatch":couponBatchId,
				"cityId":cityId,
			}, function(data) {
			});
        }
        
       
    
    </script>
    
</body>
</html>